{include file='public/header' /}
    <form class="layui-form" action="">
        <div class="layui-form-item">
            <label class="layui-form-label">输入框</label>
            <div class="layui-input-block">
                <input type="text" name="content" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <div class="layui-btn" id="sendMessage">发送</div>
            </div>
        </div>
    </form>
    <script>
        $(function(){
            
            // 打开一个 web socket
            var ws = new WebSocket("ws://tp5.io:2346");
            ws.onopen = function() { 
                layer.msg("连接中...", { icon: 6 });
            };
                
            ws.onmessage = function (evt) { 
                var received_msg = evt.data;
                layer.alert(received_msg, { icon: 6 });
            };

            ws.onerror = function (evt) { 
                layer.msg("连接服务器错误", { icon: 5 });
            };

            $('#sendMessage').click(function(){
                var val = $('input[name=content]').val();
                ws.send(val);
            });

        })
    </script>

{include file='public/footer' /}